.mobile-inner-header{ background:rgba(172,0,73,.95); width: 100%; height: 50px; position: relative; top: 0px; left: 0px;z-index: 9999999; } .mobile-inner-header-icon{ color: #ffffff; height: 50px; font-size:25px; text-align: center; float:right; width: 50px; position: relative; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } .mobile-inner-header-icon:hover{ background-color: rgba(255,255,255,0.2); cursor: pointer; } .mobile-inner-header-icon span{ position: absolute; left: calc((100% - 25px) / 2); top: calc((100% - 1px) / 2); width: 25px; height: 1px; background-color: rgba(255,255,255,1); } .mobile-inner-header-icon span:nth-child(1){ transform: translateY(4px) rotate(0deg); } .mobile-inner-header-icon span:nth-child(2){ transform: translateY(-4px) rotate(0deg); } .mobile-inner-header-icon-click span:nth-child(1){ animation-duration: 0.5s; animation-fill-mode: both; animation-name: clickfirst; } .mobile-inner-header-icon-click span:nth-child(2){ animation-duration: 0.5s; animation-fill-mode: both; animation-name: clicksecond; } @keyframes clickfirst { 0% { transform: translateY(4px) rotate(0deg); } 100% { transform: translateY(0) rotate(45deg); } } @keyframes clicksecond { 0% { transform: translateY(-4px) rotate(0deg); } 100% { transform: translateY(0) rotate(-45deg); } } @keyframes outfirst { 0% { transform: translateY(0) rotate(-45deg); } 100% { transform: translateY(-4px) rotate(0deg); } } @keyframes outsecond { 0% { transform: translateY(0) rotate(45deg); } 100% { transform: translateY(4px) rotate(0deg); } } .mobile-inner-nav{ background-color: rgba(0,0,0,0.9); width: 100%; position: absolute; top: 50px; left: 0px; display: none; z-index:9999999 } .mobile-inner-nav a{ -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: returnToNormal; animation-name: returnToNormal; } @-webkit-keyframes returnToNormal { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes returnToNormal { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .cd-logo { float: left; margin: 5px 0 0 10px; } .cd-logo img{width:220px;} .mobile-menu-list{ background-color: #222222; } .mobile-menu-item{ padding: 10px 20px; border-bottom: 1px solid #444; } .mobile-menu-item a{display: block;font-size: 14px;color: #efefef} .filter{ filter:alpha(opacity=80); /*鏀寔 IE 娴忚鍣?/ -moz-opacity:0.80; /*鏀寔 FireFox 娴忚鍣?/ opacity:0.80; /*鏀寔 Chrome, Opera, Safari 绛夋祻瑙堝櫒*/} @media (max-width:768px){ .show { display: none !important; } .hide { display: block !important; } .col-tit h2{font-size: 21px;} .col-tit p{line-height: 15px} .col-txt{color: #666;width: 100%;height: 206px;overflow: auto;background:#f5f5f5;} .col-txt p{padding: 20px;font-size: 14px;line-height: 30px;text-indent: 2em;} #part-1{background:#f5f5f5;padding: 30px 0 0px 0;} #part-2{background:#fff;padding: 30px 0;} #part-3{background:#f5f5f5;padding: 30px 0;} #part-4{background:#fff;padding: 30px 0;} .col-main{margin:10px 0;} .col-main .col-lg-4{padding: 0;} section.list-top {position:relative;height:180px;max-height:180px;} #productNumber{ position: relative; top:40%;} .product-number-inner li i{font-family: 'Impact';font-size:21px;color: #fce7e7;font-style: normal;} .product-number-inner li p{font-size: 16px;color: #fce7e7;margin-top:.1em;} .col-newsinfo .title{font-weight: normal;} .col-newspic img{ height: 180px; width: 100%; max-width: 450px; } .col-box{color: #fff;padding: 10px 0} .col-box .col-main{padding: 15px;} .col-box-1{position: relative;height: 250px;background: #b6b6b6 url({zzz:tempath}images/zjsu-1911.png) no-repeat right center;} .col-box h3{font-size: 26px;} .col-box p{font-size: 16px;padding: 10px 0;line-height: 25px;} .col-box-2{height: 200px;overflow: hidden;} .col-box-3{position: relative;height: 250px;background: #7f0000 url({zzz:tempath}images/zjsu-1911.png) no-repeat right center;} .item-2 .col-more-3{font-size: 14px;} .imore{text-align: center;margin-top:20px;} .imore a{border:1px solid #ccc;border-radius: 25px;padding: 10px 50px;font-size: 14px;} .imore a:hover{background-color: #fff;} #footer{padding: 20px;text-align: center;font-size:14px;} }